<template>
  <div id='commodity_create'>
    <Row type='flex'
         justify='center'
         style="padding:60px 100px">
      <Col style="width: 1200px;">
      <Steps :current="current">
        <Step title="选择商品分类"
              class="prev"></Step>
        <Step title="填写商品信息"
              class="prev"></Step>
        <Step title="填写属性信息"
              class="prev"></Step>
        <Step title="完成"
              class="complate"></Step>
      </Steps>
      </Col>
    </Row>
    <div class="first-level content-style"
         v-show='current === 0'
         style="width: 850px">
      <div class="title">
        <p></p>
        <span>商品分类</span>
      </div>
      <Form ref="formValidate1"
            :model="formValidate1"
            :rules="ruleValidate1"
            :label-width="85"
            style="width: 850px;">
        <FormItem label="所属类型："
                  prop="involvedType">
          <Select v-model="formValidate1.involvedType"
                  @on-change="seletcType"
                  class='input-wid'
                  style="width: 260px">
            <Option v-for="(item, index) in involvedTypeList"
                    :value="item.typeCode"
                    :key="index">{{item.typeName}}</Option>
          </Select>
        </FormItem>
        <FormItem label="所属分类："
                  prop="involvedClassify">
          <div style="display: flex;">
            <div class="classify-content">
              <div class="section-content">
                <p>选择一级分类</p>
                <ul style="overflow-y: auto;height: 222px;cursor:pointer">
                  <li v-for='(first,idx) in firstList'
                      :key='idx'
                      :class="active===idx?'selected':''"
                      @click='selectFirstClassify(first,idx)'>
                    <span>{{first.categoryName}}</span>
                    <Icon type="ios-arrow-forward"
                          size='16' />
                  </li>
                </ul>
              </div>
              <div style="margin: 0 40px;">
                <!-- <Button type="primary">
                  <Icon type="ios-arrow-forward" /></Button> -->
              </div>
              <div class="section-content">
                <p>选择二级分类</p>
                <ul style="overflow-y: auto;height: 222px;cursor:pointer">
                  <li v-for='(second,idx) in secondList'
                      :key='idx'
                      :class="active2===idx?'selected':''"
                      @click='selectSecondClassify(second,idx)'>{{second.categoryName}}</li>
                </ul>
              </div>
            </div>
            <div style="display: flex;align-items: center;margin-left: 30px;height: 32px;color: #2D8CF0;cursor: pointer;"
                 @click="addcategory">
              <Icon type="ios-add-circle"
                    size='20' /><span>新增分类</span>
            </div>
          </div>
          <div>您当前选择的商品类别是：<span style="color:rgb(242,90,83)">{{formValidate1.involvedClassify[0].categoryName}}{{formValidate1.involvedClassify[1]?'>':''}}{{formValidate1.involvedClassify[1].categoryName}}</span></div>
        </FormItem>
        <FormItem>
          <Button type="primary"
                  @click='submitOne'>下一步</Button>
        </FormItem>
      </Form>
    </div>
    <div class="second-level content-style"
         v-show='current === 1'
         style="width: 850px">
      <div class="title">
        <p></p>
        <span>商品信息</span>
      </div>
      <Form inline
            ref="formValidate2"
            :model="formValidate2"
            :rules="ruleValidate2"
            :label-width="95"
            style="width: 850px;">
        <FormItem label="商品分类："
                  prop="productClassify">
          <Input v-model="formValidate2.productClassify"
                 placeholder="请输入"
                 style="width: 118px"
                 disabled></Input>
          <span style="color:#DCDEE2;margin: 0 8px">-</span>
          <Input v-model="formValidate2.productClassify2"
                 placeholder="请输入"
                 style="width: 118px"
                 disabled></Input>
          <span style="color: #2D8CF0;margin-left: 8px;cursor:pointer"
                @click='skipTwo'>编辑</span>
        </FormItem>
        <FormItem label="是否虚拟商品："
                  prop="isShow"
                  :label-width='180'>
          <RadioGroup v-model="formValidate2.isShow"
                      size="large">
            <Radio label="1">是</Radio>
            <Radio label="0"
                   style="margin-left:50px">否</Radio>
          </RadioGroup>
        </FormItem>
        <!-- <FormItem label="所属类型：" prop="relateType" :style="formValidate1.involvedType === '3' && formValidate2.businessType !=='7' ? styles : ''"> -->
        <FormItem label="所属类型："
                  prop="relateType">
          <Input :value="formValidate2.relateType"
                 placeholder="请输入"
                 style="width: 255px"
                 disabled></Input>
          <!-- <Select v-model="formValidate2.relateType" class='input-wid' style='width:255px'>
            <Option v-for="(item, index) in relateTypeList" :value="item.value" :key="index">{{item.label}}</Option>
          </Select> -->
        </FormItem>
        <FormItem label="营业项分类："
                  v-if="formValidate1.involvedType==='03'"
                  prop="businessType"
                  :label-width='180'>
          <Select v-model="formValidate2.businessType"
                  @on-change="selecebusinessType"
                  class='input-wid'
                  style='width:255px'>
            <Option v-for="(item, index) in businessTypeList"
                    :value="item.typeCode"
                    :key="index">{{item.typeName}}</Option>
          </Select>
        </FormItem>
        <FormItem label="收款项分类："
                  :label-width='95'
                  v-if="formValidate1.involvedType==='03'&&formValidate2.businessType==='0301'"
                  prop="gatherPrice">
          <Select v-model="formValidate2.gatherPrice"
                  @on-change="selecebusinessType01"
                  class='input-wid'
                  style='width:255px'>
            <Option v-for="(item, index) in gatherPriceList"
                    :value="item.typeCode"
                    :key="index">{{item.typeName}}</Option>
          </Select>
        </FormItem>
        <FormItem label="所属门店："
                  :label-width="formValidate1.involvedType==='03'&&formValidate2.businessType!=='0301'? 95: 180"
                  prop="involvedShop"
                  :rules="{required:true, message: '门店不能为空', trigger: 'blur'}"
                  v-if="formValidate1.involvedType==='03'">
          <!-- <Select v-model="formValidate2.involvedShop"
                  class='input-wid'
                  style='width:255px'>
            <Option v-for="(item, index) in involvedShopList"
                    :value="item.shopId"
                    :key="index">{{item.shopName}}</Option>
          </Select> -->
          <treeselect :options="options"
                      @select="selectListd"
                      class='input-wid'
                      :clearable="clearable"
                      :disable-branch-nodes="true"
                      style='width:255px'
                      :normalizer="normalizer"
                      noResultsText="未搜索符合的门店"
                      noOptionsText="门店为空"
                      placeholder="请选择门店"
                      v-model='formValidate2.involvedShop' />
          <!-- <Input v-model='formValidate2.involvedShop'></Input> -->
        </FormItem>
        <FormItem label="对应分类："
                  prop="matchClassify"
                  v-if="formValidate1.involvedType!=='03'"
                  :label-width='180'>
          <Select v-model="formValidate2.matchClassify"
                  @on-change="seletcType2"
                  class='input-wid'
                  style='width:255px'>
            <Option v-for="(item, index) in matchClassifyList"
                    :value="item.typeCode"
                    :key="index">{{item.typeName}}</Option>
          </Select>
        </FormItem>
        <Row>
          <FormItem label="商品名称："
                    prop="skuName">
            <Input v-model="formValidate2.skuName"
                   :maxlength="12"
                   @on-keyup="keyupskuName"
                   placeholder="请输入"
                   style="width: 255px"></Input>
          </FormItem>
          <FormItem label="副标题："
                    prop="subTitle"
                    :label-width='180'>
            <Input v-model="formValidate2.subTitle"
                   :maxlength="24"
                   @on-keyup="keyupsubTitle"
                   placeholder="请输入"
                   style="width: 255px"></Input>
          </FormItem>
        </Row>
        <FormItem label="价格："
                  prop="price"
                  v-if="formValidate1.involvedType==='02'">
          <Select v-model="formValidate2.price"
                  class='input-wid'
                  style='width:255px'>
            <Option v-for="(item, index) in priceList"
                    :value="item.id"
                    :key="index">{{item.configValue}}</Option>
          </Select>
        </FormItem>
        <FormItem label="局数："
                  prop="games"
                  v-if="formValidate1.involvedType==='02'"
                  :label-width='180'>
          <Select v-model="formValidate2.games"
                  class='input-wid'
                  style='width:255px'>
            <Option v-for="(item, index) in gamesList"
                    :value="item.id"
                    :key="index">{{item.configValue}}</Option>
          </Select>
        </FormItem>
        <FormItem label="销售形式："
                  v-if="formValidate1.involvedType==='02'"
                  prop="saleType"
                  style="display: block;">
          <Select v-model="formValidate2.saleType"
                  class='input-wid'
                  style='width:255px'>
            <Option v-for="(item, index) in saleTypeList"
                    :value="item.value"
                    :key="index">{{item.label}}</Option>
          </Select>
        </FormItem>
        <FormItem label="商品介绍："
                  prop="goodsDesc"
                  style="display: block;">
          <Input v-model="formValidate2.goodsDesc"
                 style="width: 700px"
                 type="textarea"
                 :maxlength="256"
                 :autosize="{ minRows: 4, maxRows: 8 }"
                 placeholder="请描述"
                 class="Row_content_input"></Input>
        </FormItem>
        <FormItem label="商品条码："
                  prop="barcode">
          <Input v-model="formValidate2.barcode"
                 :maxlength="13"
                 @on-keyup="keyup"
                 placeholder="请输入"
                 style="width: 255px"></Input>
          <p style="color: #808695;font-size: 12px;">如果不输入商品条码，系统将自动生成一个唯一13位编码</p>
        </FormItem>
        <!-- <FormItem label="商品编码："
                  prop="skuId"
                  :label-width='133'>
          <Input v-model="formValidate2.skuId"
                 placeholder="请输入"
                 style="width: 255px"></Input>
          <p style="color: #808695;font-size: 12px;">系统将自动生成一个唯一的货号</p>
        </FormItem> -->
        <FormItem label="售卖价格："
                  prop="salesPrice"
                  v-if="formValidate1.involvedType==='03'">
          <Input v-model="formValidate2.salesPrice"
                 :maxlength="9"
                 @on-keyup="changeprice"
                 @on-blur="priceBlur"
                 placeholder="请输入"
                 style="width: 255px"></Input>
        </FormItem>
        <FormItem label="商品单位："
                  prop="goodsUnit">
          <Select v-model="formValidate2.goodsUnit"
                  class='input-wid'
                  disabled
                  style='width:255px'>
            <Option v-for="(item, index) in goodsUnitList"
                    :value="item.value"
                    :key="index">{{item.label}}</Option>
          </Select>
        </FormItem>
        <div v-if="formValidate1.involvedType==='01'&&formValidate2.matchClassify==='0104'">
          <div class="title"
               style="margin-top:50px">
            <p></p>
            <span>组合商品</span>
          </div>
          <FormItem label="套餐类型："
                    prop="mealType">
            <Select v-model="formValidate2.mealType"
                    @on-change="selectmealType"
                    class='input-wid'
                    style='width:255px'>
              <Option v-for="(item, index) in mealTypeList"
                      :value="item.typeCode"
                      :key="index">{{item.typeName}}</Option>
            </Select>
          </FormItem>
          <FormItem label="游戏券："
                    prop="selectedMeal"
                    v-if="formValidate2.mealType==='010403'"
                    :label-width='180'>
            <Button @click="addmeal">添加游戏券
              <Icon type="ios-add"
                    size='20' /></Button>
          </FormItem>
          <FormItem label="所选列表："
                    style="display:block">
            <Table border
                   :columns="columnsMeal"
                   :data="formValidate2.selectedMeal">
              <template slot-scope="{ row }"
                        slot="unit">
                <span>{{['个','枚','份'][row.goodsUnit+'']}}</span>
              </template>
              <template slot-scope="{ row,index }"
                        slot="code">
                <div style="cursor:pointer">
                  <!-- <span style="cursor:pointer"
                        v-if="row.isshow"> -->
                  <Input v-model="row.num"
                         :maxlength="4"
                         :disabled="(formValidate2.mealType==='010402'&&row.skuName==='会员卡')||row.disable"
                         ref="inputValidate"
                         @on-keyup.stop="ketupsort(row.num,row,index)"
                         @on-blur.stop="blursort(row,row.num,index)" />
                  <!-- </span> -->
                  <!-- <span @click.stop="selectsort(row,index)"
                        style="cursor:pointer;display:block;"
                        v-if="!row.isshow">{{row.num}}</span> -->
                </div>

                <!-- <div v-if="!row.isshow"
                     @click="seletccode(row,index)">
                  <span>{{row.num}}</span>
                </div>
                <div v-if="row.isshow"><Input v-model="row.num"
                         placeholder="请输入" /></div> -->
              </template>
              <template slot-scope="{ row,index }"
                        slot="action">
                <Poptip confirm
                        title="你确定要删除吗？"
                        v-if="row.skuName !== '游戏币' && row.skuName !== '会员卡'"
                        @on-ok="ok(index)"
                        @on-cancel="cancel">
                  <i class="iconsys icondel"
                     title="删除">
                  </i>
                </Poptip>
              </template>
            </Table>
          </FormItem>
        </div>
        <div>
          <div class="title"
               style="margin-top:50px">
            <p></p>
            <span>运营信息</span>
          </div>
          <FormItem label="商品关键词："
                    prop="keywords"
                    style="display: block;">
            <Row type='flex'
                 align='bottom'>
              <Col>
              <Input v-model="formValidate2.keywords"
                     style="width: 320px"
                     type="textarea"
                     :maxlength="300"
                     :autosize="{ minRows: 4, maxRows: 8 }"
                     placeholder="请描述"
                     class="Row_content_input"></Input>
              </Col>
              <Col>
              <p style="margin-left: 10px;height: 25px;">{{formValidate2.keywords.length}}/300</p>
              </Col>
            </Row>
            <p style="color: #808695;font-size: 12px;">商品关键词请用空格分隔；有两个功能，一是可以作为站内关键词查询，在前台搜索框输入关键词后，能够搜索到该商品；二是作为搜索引擎收录使用.</p>
          </FormItem>
          <FormItem label="商品备注："
                    prop="remark"
                    style="display: block;">
            <Row type='flex'
                 align='bottom'>
              <Col>
              <Input v-model="formValidate2.remark"
                     style="width: 320px"
                     type="textarea"
                     :maxlength="300"
                     :autosize="{ minRows: 4, maxRows: 8 }"
                     placeholder="请描述"
                     class="Row_content_input"></Input>
              </Col>
              <Col>
              <p style="margin-left: 10px;height: 25px;">{{formValidate2.remark.length}}/300</p>
              </Col>
            </Row>
          </FormItem>
          <FormItem label="游戏币数量："
                    v-if="formValidate1.involvedType==='01'&&formValidate2.matchClassify==='0102'"
                    prop="tableDataGameCoin"
                    style="display: block;">
            <Table border
                   :columns="columnsMeal"
                   :data="formValidate2.tableDataGameCoin">
              <template slot-scope="{ row }"
                        slot="unit">
                <span>{{['个','枚','份'][row.goodsUnit+'']}}</span>
              </template>
              <template slot-scope="{ row,index }"
                        slot="code">
                <div style="cursor:pointer">
                  <!-- <span style="cursor:pointer"
                        v-if="row.isshow"> -->

                  <Input v-model="row.num"
                         :maxlength="4"
                         ref="inputValidated"
                         @on-keyup.stop="ketupsort2(row.num,row,index)"
                         @on-blur.stop="blursort2(row,row.num,index)" />
                  <!-- </span>
                  <span @click.stop="selectsort2(row,index)"
                        style="cursor:pointer;display:block;"
                        v-if="!row.isshow">{{row.num}}</span> -->
                </div>
              </template>
              <template slot-scope="{ row,index }"
                        slot="action">
                <Poptip confirm
                        v-if="row.skuName !== '游戏币'"
                        title="你确定要删除吗？"
                        @on-ok="ok(index)"
                        @on-cancel="cancel">
                  <i class="iconsys icondel"
                     title="删除">
                  </i>
                </Poptip>
              </template>
            </Table>
          </FormItem>
          <FormItem>
            <div style="margin-top: 20px">
              <Button class="btn"
                      @click="skipTwo">上一步</Button>
              <Button type="primary"
                      class="btn"
                      style="margin-left: 24px"
                      @click="submitTwo">下一步</Button>
            </div>
          </FormItem>
        </div>
      </Form>
    </div>
    <div class="third-level content-style"
         v-show='current === 2'
         style="width: 910px;">
      <Form ref="formValidate3"
            :model="formValidate3"
            :rules="ruleValidate3"
            :label-width="200"
            style="width: 910px;">
        <div id='three-form'
             v-if="packageShow">
          <div class="title">
            <p></p>
            <span>属性参数</span>
          </div>
          <FormItem label="相关参数："
                    prop="relateParam">
            <Form :label-width="200"
                  ref="formDynamic"
                  :model="formDynamic">
              <div style='display:flex;background: #F3F3F3;'>
                <p style='width: 224px;text-align:right;border:1px solid #DCDEE2;padding-right:10px'>参数类型</p>
                <p style='border:1px solid #DCDEE2;flex:1;text-align:center;border-left: 0'>录入参数</p>
              </div>
              <FormItem :label="item.valueId"
                        v-for="(item,idx) in formDynamic.list"
                        :key='idx'
                        :prop="'list.' + idx + '.value'"
                        :rules="{required: item.notNull === 1 ? true : false, message: item.inputType === 0 ? '请输入参数值': '请选择参数值',type: item.inputType === 2 ? 'array': 'string', trigger: 'change'}"
                        style='padding:20px;border:1px solid #DCDEE2;border-top:0'>
                <Input style="width:260px"
                       v-if="item.inputType === 0"
                       :maxlength="20"
                       @on-blur="selectinputtype(...arguments, item)"
                       v-model="item.value"></Input>
                <Select style="width:260px"
                        v-if="item.inputType === 1 || item.inputType === 2"
                        :multiple="item.inputType === 2? true: false"
                        @on-change="selcteinput(...arguments, item)"
                        v-model="item.value">
                  <Option v-for="(ele,index) in item.selectList"
                          :value="ele.propValueId"
                          :key="index">{{ ele.propValue}}</Option>
                </Select>
              </FormItem>
            </Form>
          </FormItem>
        </div>
        <div>
          <div class="title">
            <p></p>
            <span>商品相册</span>
          </div>
          <FormItem label="上传图片："
                    prop="loadImg">
            <Row type="flex">
              <Col>
              <div class="demo-upload-list"
                   style="display:flex">
                <div v-for="(item,idx) in uploadList"
                     :key='idx'
                     style="position: relative;">
                  <div style="margin-right: 20px;position:relative;">
                    <div style="font-size: 12px;color: #FFFFFF;border: 1px solid #FFFFFF;border-radius: 2px;width:56px;height:20px;line-height:20px;text-align:center;position:absolute;top:4px;left:4px;background: #e7314e;"
                         v-if="idx===0">商品主图</div>
                    <img :src="item.multUrl"
                         style="display: inline-block;width:96px;height:96px;vertical-align: top;cursor:pointer;">
                  </div>
                  <div style="text-align: center;width:96px;margin-left:18px;cursor:pointer;"
                       v-if="idx!==0">
                    <p style='width: 60px;height: 24px;line-height: 24px;background: #2D8CF0;border-radius: 2px;color:#fff;margin-top:8px;cursor:pointer;'
                       @click="setmaster(idx,item)">设为主图</p>
                  </div>
                  <div class="demo-upload-list-cover"
                       @click="removelist(item,idx)"
                       style="position: absolute; left: 0;top: 72px;background: #ED4014;opacity: 0.6;width:96px;height: 24px;line-height: 24px;color: #fff;text-align: center;cursor:pointer">
                    <span>删除</span>
                  </div>
                </div>
              </div>
              </Col>
              <Col>
              <Upload ref="upload"
                      :show-upload-list="false"
                      :default-file-list="defaultList"
                      :on-success="handleSuccess"
                      :format="['jpg','jpeg','png']"
                      :max-size="5120"
                      :on-format-error="handleFormatError"
                      :on-exceeded-size="handleMaxSize"
                      :before-upload="handleBeforeUpload"
                      multiple
                      type="drag"
                      :action="$config.uploadImg"
                      style="display: inline-block;width:96px;">
                <div>
                  <img :src="defaultUrl"
                       alt=""
                       style="display: inline-block;width:96px;height:96px;vertical-align: top;">
                </div>
              </Upload>
              </Col>
              <Col>
              <div style="width:132px;height:72px;line-height:18px;color: #464C5B;margin-left:16px">
                <p>建议上传图片800*800px</p>
                <p>格式支持上传jpg、png</p>
                <p>图片限制最大5M</p>
              </div>
              </Col>
            </Row>
          </FormItem>
        </div>
        <div>
          <div class="title">
            <p></p>
            <span>商详信息</span>
          </div>
          <FormItem label="商品详情："
                    prop="productDetail">
            <div ref="addEditor"
                 class="rich-editor"></div>
          </FormItem>
          <FormItem>
            <div style="margin-top: 20px">
              <Button class="btn"
                      @click="skipThree">上一步</Button>
              <Button type="primary"
                      class="btn"
                      style="margin-left: 24px"
                      @click="submitThree">下一步</Button>
            </div>
          </FormItem>
        </div>
      </Form>
    </div>
    <div class="four-level content-style"
         style="width: 120px;text-align: center;padding-top: 50px"
         v-show='current === 3'>
      <div style="color: #18BE6B;">
        <Icon type="ios-checkmark-circle-outline"
              size='35' />
      </div>
      <h3 style="margin: 10px 0 50px 0">完成商品添加({{num}})秒</h3>
      <Button type="primary"
              @click='skipList'>返回商品列表</Button>
    </div>
    <select-shop :checkdList="checkdList"
                 :modalShow="modalShow"
                 :tpyeIndex="seletIndex3"
                 @oncancel="selctshopCancel"
                 @selctshop="volumeSet"
                 v-if="modalShow">
    </select-shop>
  </div>
</template>

<script>
// import { routeEqual } from '@/libs/util'
import SelectShop from '@/view/components/selet-securities/selet-securities.vue'
import editor from '../../market/game-ticket/mixins.js'
// import { kindList, shopCategoryList, configList, goodsList, propertyList, creatGoodsList } from '@/api/goods/index'
import { kindList, shopCategoryList, configList, goodsList, propertyList, creatGoodsList, porbaoList } from '@/api/goods/index'
import { getOrgAllTree } from '@/api/system/org'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
  name: 'commodity_create',
  components: { SelectShop, Treeselect },
  mixins: [editor],
  watch: {
    modalShow (val) {
      // if (val) {
      //   this.checkdList = []
      // }val
    },
    packageId (val) {
      if (val) {
        this.formDynamic.list = []
        this.getPropertyList()
      } else {
        this.formDynamic.list = []
      }
    },
    // goodsKindList (val) {
    //   val.forEach((ele, index) => {
    //     if (ele.id === '') {
    //       val.splice(index, 1)
    //     }
    //   })
    //   this.goodsKindList = val
    // },
    'formValidate2.mealType' (val) {
      this.goodsComboList = []
    },
    current (val) {
      if (this.current === 1) {
        this.formValidate2.relateType = this.involvedTypeList[this.seletIndex].typeName
        this.formValidate2.productClassify = this.formValidate1.involvedClassify[0].categoryName
        this.formValidate2.productClassify2 = this.formValidate1.involvedClassify[1].categoryName
        this.getConfigList()
        this.getShopList()
      } else if (this.current === 2) {
        // if (this.packageId) {
        //   this.formDynamic.list = []
        //   this.getPropertyList()
        // } else {
        //   this.formDynamic.list = []
        // }
      } else if (this.current === 3) {
        this.num = 3
        this.timer = setInterval(() => {
          this.num--
          if (this.num === 0) {
            clearInterval(this.timer)
            this.handleReset()
          }
        }, 1000)
      }
    },
    'formValidate2.matchClassify' (val) {
      this.goodsComboList = []
    },
    'formValidate1.involvedType' (val) {
      this.formValidate2 = {
        productClassify: '',
        productClassify2: '',
        isShow: '',
        matchClassify: '',
        skuName: '', // 商品名称
        subTitle: '', // 副标题
        goodsDesc: '', // 商品介绍
        barcode: '', // 商品条码
        goodsUnit: 0, // 商品单位
        keywords: '', // 商品关键词
        remark: '', // 商品备注
        mealType: '', // 套餐类型
        selectedMeal: [], // 所选列表
        tableDataGameCoin: [], // 游戏币数量
        price: '', // 价格
        games: '', // 局数
        saleType: '', // 销售形式
        businessType: '', // 营业项分类
        salesPrice: '', // 售卖价格
        gatherPrice: '', // 收款项分类
        involvedShop: null // 所属门店
      }
    }
  },
  computed: {
    selectedMeal () {
      return this.formValidate2.selectedMeal
    },
    packageShow () {
      if (!this.packageId) {
        return false
      } else {
        if (this.formDynamic.list.length === 0) {
          return false
        } else {
          return true
        }
      }
    },
    porLenght () {
      return this.formDynamic.list.length
    },
    tableDataGameCoin () {
      return this.formValidate2.tableDataGameCoin
    },
    goodsComboList1 () {
      let arr2 = []
      this.tableDataGameCoin.forEach(ele => {
        arr2.push({
          subSkuId: ele.skuId,
          num: ele.num
        })
      })
      return arr2
    },
    goodsComboList2 () {
      let arr = []
      this.selectedMeal.forEach(ele => {
        arr.push({
          subSkuId: ele.skuId,
          num: ele.num
        })
      })
      return arr
    }
  },
  data () {
    return {
      formDynamic: {
        list: []
      },
      options: [],
      clearable: false,
      num: 3,
      arrData: [],
      timer: '',
      packageId: '',
      current: 0,
      defaultUrl: require('@/assets/images/add.png'),
      defaultList: [],
      active: '',
      active2: 0,
      uploadList: [],
      typeIDOne: '', // 类型id
      typeIDTwo: '',
      typeIDThree: '',
      checkdList: [],
      itemList: [],
      maxTagPlaceholder (num) {
        return '...'
      },
      modalShow: false,
      seletIndex: 0, // 所属类型1
      seletIndex2: 0, // 对应分类
      seletIndex3: 0, // 套餐
      seletIndex4: 0, // 营业项分类
      involvedTypeList: [],
      goodsKindList: [], // 商品业务类别
      multUrlList: [], // 商品图片url列表
      propertyList: [], // 属性参数列表
      goodsComboList: [], // 子商品列表,
      firstList: [],
      categoryId: '', // 类目id
      secondList: [
        { value: '家居服', id: 'a' }
      ],
      formValidate1: {
        involvedType: '', // 所属类型
        involvedClassify: ['', ''] // 所属分类
      },
      ruleValidate1: {
        involvedType: { required: true, message: '请选择所属类型', trigger: 'change' },
        involvedClassify: {
          required: true,
          type: 'array',
          trigger: 'change',
          validator: (rule, value, callback) => {
            if (value[0] !== '' && value[1] !== '') {
              callback()
            } else {
              callback(new Error('请选择所属分类'))
            }
          }
        }
      },
      normalizer (node) {
        return {
          id: node.id,
          label: node.orgName,
          children: node.childList && node.childList.length ? node.childList : undefined
        }
      },
      relateTypeList: [],
      matchClassifyList: [],
      businessTypeList: [],
      mealTypeList: [],
      goodsUnitList: [
        { value: 0, label: '个' },
        { value: 1, label: '枚' },
        { value: 2, label: '份' }
      ],
      columnsMeal: [
        {
          title: '商品条码',
          key: 'barcode',
          width: 200
        },
        {
          title: '商品名称',
          key: 'skuName',
          width: 200
        },
        {
          title: '单位',
          slot: 'unit'
        },
        {
          title: '数量',
          slot: 'code'
        },
        {
          title: '操作',
          slot: 'action'
        }
      ],
      formValidate2: {
        productClassify: '',
        productClassify2: '',
        isShow: '',
        relateType: '',
        matchClassify: '',
        skuName: '', // 商品名称
        subTitle: '', // 副标题
        goodsDesc: '', // 商品介绍
        barcode: '', // 商品条码
        goodsUnit: 0, // 商品单位
        keywords: '', // 商品关键词
        remark: '', // 商品备注
        mealType: '', // 套餐类型
        selectedMeal: [], // 所选列表
        tableDataGameCoin: [], // 游戏币数量
        price: '', // 价格
        games: '', // 局数
        saleType: '', // 销售形式
        businessType: '', // 营业项分类
        salesPrice: '', // 售卖价格
        gatherPrice: '', // 收款项分类
        involvedShop: null // 所属门店
      },
      ruleValidate2: {
        productClassify: { required: true, message: '请选择商品分类', trigger: 'change' },
        isShow: { required: true, message: '请选择是否虚拟商品', trigger: 'change', type: 'string' },
        // involvedShop: { required: true, message: '请选择门店', trigger: 'blur' },
        // relateType: { required: true, message: '请选择所属类型', trigger: 'blur', type: 'string' },
        matchClassify: { required: true, message: '对应分类不能为空', trigger: 'change', type: 'string' },
        barcode: {
          trigger: 'blur',
          validator: (rule, value, callback) => {
            if (!value) {
              callback()
            } else if (value) {
              if (value.length !== 13) {
                callback(new Error('请输入13个字符的商品条码'))
              } else {
                callback()
              }
            }
          }
        },
        goodsUnit: { required: true, message: '商品单位不能为空', trigger: 'change', type: 'number' },
        businessType: { required: true, message: '请选择营业项分类', trigger: 'change' },
        mealType: { required: true, message: '请选择套餐类型', trigger: 'change' },
        skuName: { required: true, message: '请填写商品名称', trigger: 'blur' },
        selectedMeal: {
          required: true,
          type: 'array',
          trigger: 'change',
          validator: (rule, value, callback) => {
            if (this.formValidate2.mealType === '010403') {
              if (value.length > 2 || value.length === 2) {
                callback()
              } else {
                callback(new Error('请选择游戏劵'))
              }
            } else {
              if (value.length > 0) {
                callback()
              } else {
                callback(new Error('请选择游戏劵'))
              }
            }
          }
        },
        gatherPrice: { required: true, message: '请选择收款项分类', trigger: 'change' },
        salesPrice: { required: true, message: '请选择售卖价格', trigger: 'blur' },
        price: { required: true, message: '请选择商品价格', trigger: 'change' },
        games: { required: true, message: '请选择局数', trigger: 'change' },
        saleType: { required: true, message: '请选择销售形式', trigger: 'change', type: 'number' }
      },
      gatherPriceList: [], // 收款项分类
      involvedShopList: [], // 所属门店列表
      priceList: [],
      gamesList: [],
      saleTypeList: [
        { value: 0, label: '支持组合' },
        { value: 1, label: '不支持组合' }
      ],
      columns: [
        {
          title: '参数类型',
          slot: 'type'
        },
        {
          title: '录入参数',
          slot: 'paramter'
        }
      ],
      tableData: [],
      formValidate3: {
        relateParam: '',
        loadImg: ''
      },
      ruleValidate3: {},
      styles: {
        display: 'block'
      }
    }
  },
  methods: {
    // 添加分类
    addcategory () {
      this.$router.push({ name: 'classify_create' })
    },
    selectListd (data) {
      this.formValidate2.involvedShop = data.id
      // this.$refs.formValidate.validate((valid) => { })
      this.$refs.formValidate2.validateField('involvedShop', (valid) => { })
    },
    changeprice () {
      this.changeNum()
    },
    changeNum () {
      // 如果用户第一位输入的是小数点，则重置输入框内容
      if (this.formValidate2.salesPrice !== '' && this.formValidate2.salesPrice.substring(0, 1) === '.') {
        this.formValidate2.salesPrice = ''
      }
      this.formValidate2.salesPrice = this.formValidate2.salesPrice.replace(/^0*(0\.|[1-9])/, '$1')// 粘贴不生效
      this.formValidate2.salesPrice = this.formValidate2.salesPrice.replace(/[^\d.]/g, '') // 清除“数字”和“.”以外的字符
      this.formValidate2.salesPrice = this.formValidate2.salesPrice.replace(/\.{2,}/g, '.') // 只保留第一个. 清除多余的
      this.formValidate2.salesPrice = this.formValidate2.salesPrice.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.')
      this.formValidate2.salesPrice = this.formValidate2.salesPrice.replace(/^(-)*(\d+)\.(\d\d).*$/, '$1$2.$3') // 只能输入两个小数
      if (this.formValidate2.salesPrice.indexOf('.') < 0 && this.formValidate2.salesPrice !== '') { // 以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
        if (this.formValidate2.salesPrice.substring(0, 1) === '0' && this.formValidate2.salesPrice.length === 2) {
          this.formValidate2.salesPrice = this.formValidate2.salesPrice.substring(1, this.formValidate2.salesPrice.length)
        }
      }
      if (this.formValidate2.salesPrice > 999999) {
        this.formValidate2.salesPrice = this.formValidate2.salesPrice.substring(0, 6)
      }
    },
    priceBlur () {
      this.formValidate2.salesPrice = this.formValidate2.salesPrice + ''
      this.formValidate2.salesPrice = this.formValidate2.salesPrice.replace(/[^\d.]/g, '')
      if (this.formValidate2.salesPrice === '') {
        this.formValidate2.salesPrice = ''
      } else if (this.formValidate2.salesPrice.indexOf('.') === -1) {
        this.formValidate2.salesPrice = this.formValidate2.salesPrice + '.00'
      } else if (this.formValidate2.salesPrice.indexOf('.')) {
        let ste = this.formValidate2.salesPrice.substring(this.formValidate2.salesPrice.indexOf('.') + 1)
        if (!ste) {
          this.formValidate2.salesPrice = this.formValidate2.salesPrice + '00'
        }
        if (ste.length === 1) {
          this.formValidate2.salesPrice = this.formValidate2.salesPrice + '0'
        } if (ste.length > 2) {
          this.formValidate2.salesPrice = this.formValidate2.salesPrice.substring(0, this.formValidate2.salesPrice.indexOf('.') + 3)
        }
      }
    },
    // 删除
    ok (idx) {
      this.formValidate2.selectedMeal.splice(idx, 1)
    },
    // 取消
    cancel () {

    },
    keyup () {
      this.formValidate2.barcode = this.formValidate2.barcode.replace(/\s+/g, '')
      this.formValidate2.barcode = this.formValidate2.barcode.replace(/[^a-z0-9A-Z]/g, '')
    },
    keyupskuName () {
      this.formValidate2.skuName = this.formValidate2.skuName.replace(/\s+/g, '')
      this.formValidate2.skuName = this.formValidate2.skuName.replace(/[^\w\u4E00-\u9FA5]/g, '')
    },
    keyupsubTitle () {
      this.formValidate2.subTitle = this.formValidate2.subTitle.replace(/\s+/g, '')
      // this.formValidate2.subTitle = this.formValidate2.subTitle.replace(/[^\w\u4E00-\u9FA5]/g, '')
    },
    // 获取属性列表
    getPropertyList () {
      this.formDynamic.list = []
      porbaoList({
        merchantId: this.$store.state.user.merchantId,
        packageId: this.packageId
      }).then(dat => {
        if (dat.data.status === 200) {
          if (dat.data.data) {
            if (dat.data.data.isShow) {
              propertyList({
                merchantId: this.$store.state.user.merchantId,
                packageId: this.packageId,
                searchStatus: 1,
                searchKey: '',
                sortId: '1'
              }).then(res => {
                if (res.data.status === 200) {
                  let dataList = []
                  res.data.data.map(ele => {
                    let obj = { ...ele }
                    dataList.push(obj)
                  })
                  dataList.forEach(ele => {
                    if (ele.inputType === 0) {
                      this.$set(ele, 'propValue', '')
                    }
                  })
                  this.tableData = dataList
                  if (this.tableData.length > 0) {
                    this.tableData.forEach(item => {
                      let data = {
                        inputType: item.inputType,
                        value: '',
                        notNull: item.notNull,
                        valueId: item.propName,
                        propNameId: item.propNameId,
                        selectList: []
                      }
                      item.propertyValueList.forEach(ele => {
                        data.selectList = item.propertyValueList
                      })
                      this.formDynamic.list.push(data)
                    })
                  }
                } else {
                  this.$Message.error(`${res.data.error}`)
                }
              })
            }
          }
        } else {
          this.$Message.error(`${dat.data.error}`)
        }
      })
    },
    // 筛选属性值
    selcteinput (val, item) {
      if (!Array.isArray(val)) {
        this.propertyList.push(item.selectList.filter(ele => ele.propValueId === val)[0])
      } else {
        item.selectList.forEach(ele => {
          val.forEach((eld) => {
            if (ele.propValueId === eld) {
              if (this.propertyList.indexOf(eld) === -1) {
                this.propertyList.push(ele)
              }
            }
          })
        })
      }
    },
    selectinputtype (val, item) {
      if (this.propertyList.indexOf(item.propNameId) === -1) {
        this.propertyList.push({
          propValue: item.value,
          propName: item.valueId,
          propNameId: item.propNameId
        })
      }
    },
    ketupsort (sort, row, index) {
      var res = String(sort)
      if (sort.length === 1) {
        res = sort.replace(/[^1-9]/g, '')
      } else {
        res = sort.replace(/^(0+)|[^\d]+/g, '')
      }
      row.num = res
      this.$set(this.formValidate2.selectedMeal[index], 'num', res)
    },
    // 设置主图
    setmaster (idx, item) {
      let data = item
      this.uploadList.splice(idx, 1)
      this.uploadList.unshift(data)
    },
    // 设置套餐num值
    blursort (e, sort, index) {
      let res = String(sort)
      if (sort.length === 1) {
        res = res.replace(/[^0-9]/g, '')
      } else {
        res = res.replace(/^(0+)|[^\d]+/g, '')
      }
      e.num = res
      this.$set(this.formValidate2.selectedMeal[index], 'num', res || '1')
    },
    selectsort (row, idx) {
      // this.selectedIndex = idx
      // row.sortShow = true
      this.formValidate2.selectedMeal.forEach(ele => {
        this.$set(ele, 'isshow', false)
      })
      this.$set(this.formValidate2.selectedMeal[idx], 'isshow', true)
      this.$nextTick(() => {
        this.$refs.inputValidate.focus()
      })
    },
    // 设置兑换劵值
    ketupsort2 (sort, row, index) {
      var res = String(sort)
      if (sort.length === 1) {
        res = sort.replace(/[^1-9]/g, '')
      } else {
        res = sort.replace(/^(0+)|[^\d]+/g, '')
      }
      row.num = res
      this.$set(this.formValidate2.tableDataGameCoin[index], 'num', res)
    },
    blursort2 (e, sort, index) {
      // e.isshow = false
      var res = String(sort)
      if (sort.length === 1) {
        res = res.replace(/[^1-9]/g, '')
      } else {
        res = res.replace(/^(0+)|[^\d]+/g, '')
      }
      e.num = res
      this.$set(this.formValidate2.tableDataGameCoin[index], 'num', res || '1')
    },
    selectsort2 (row, idx, index) {
      // this.selectedIndex = idx
      // row.sortShow = true
      this.formValidate2.tableDataGameCoin.forEach(ele => {
        this.$set(ele, 'isshow', false)
      })
      this.$set(this.formValidate2.tableDataGameCoin[idx], 'isshow', true)
      this.$nextTick(() => {
        this.$refs.inputValidated.focus()
      })
    },
    // 移除图片
    removelist (file, idx) {
      this.uploadList.splice(idx, 1)
    },
    // 获取门店列表
    getShopList () {
      getOrgAllTree({
        'merchantId': this.$store.state.user.merchantId,
        'orgType': 1,
        perms: 'moms:product:productcreate',
        status: 1,
        id: this.$store.state.user.orgId
        // perms: "moms:report:groupbuyanalytics"
      }).then(res => {
        if (res.data.status === 200) {
          this.options = [res.data.data]
          if (res.data.data.childList.length === 0) {
            this.formValidate2.involvedShop = res.data.data.id
          }
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
    },
    // 获取游戏劵列表配置
    getConfigList () {
      configList({
        merchantId: this.$store.state.user.merchantId,
        configType: '1',
        offset: 0,
        limit: 9999
      }).then(res => {
        if (res.data.status === 200) {
          this.priceList = res.data.data
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
      configList({
        merchantId: this.$store.state.user.merchantId,
        configType: '2',
        offset: 0,
        limit: 9999
      }).then(res => {
        if (res.data.status === 200) {
          this.gamesList = res.data.data
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
    },
    // 获取分类列表
    getkindList () {
      kindList({
        // merchantId: this.$store.state.user.merchantId,
        merchantId: 'dwj',
        level: 1
      }).then(res => {
        if (res.data.status === 200) {
          this.involvedTypeList = res.data.data
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
    },
    // 获取一级分类
    seletcType (val) {
      this.involvedTypeList.forEach((ele, index) => {
        if (val === ele.typeCode) {
          this.seletIndex = index
        }
      })
      this.typeIDOne = val
      this.goodsKindList[0] = { id: val, level: 1 }
      kindList({
        merchantId: this.$store.state.user.merchantId,
        level: 2,
        parentId: val
      }).then(res => {
        if (res.data.status === 200) {
          this.matchClassifyList = res.data.data
          this.businessTypeList = res.data.data
          // this.formValidate2.businessType = this.businessTypeList[0] ? this.businessTypeList[0].typeCode : ''
          // this.involvedTypeList = res.data.data
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
    },
    // 获取三级分类
    seletcType2 (val) {
      this.matchClassifyList.forEach((ele, index) => {
        if (val === ele.typeCode) {
          this.seletIndex2 = index
        }
      })
      this.typeIDTwo = val
      this.goodsKindList[1] = { id: val, level: 2 }
      kindList({
        merchantId: this.$store.state.user.merchantId,
        level: 3,
        parentId: val
      }).then(res => {
        if (res.data.status === 200) {
          this.mealTypeList = res.data.data
          // this.involvedTypeList = res.data.data
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
      if (this.seletIndex2 === 1) {
        goodsList({
          merchantId: this.$store.state.user.merchantId,
          goodsStatus: 1,
          goodsKindIdList: ['01-0101'],
          offset: 0,
          limit: 9999
        }).then(res => {
          if (res.data.status === 200) {
            let goods = res.data.data.goods
            goods = res.data.data.goods
            this.formValidate2.tableDataGameCoin = goods.map(ele => {
              return { ...ele, num: 1, isshow: false, checked: false }
            }).filter(ele => ele.skuName === '游戏币')
          } else {
            this.$Message.error(`${res.data.error}`)
          }
        })
      }
    },
    // 获取门店列表
    getshopCategoryList () {
      shopCategoryList({
        merchantId: this.$store.state.user.merchantId,
        isShow: 1
      }).then(res => {
        if (res.data.status === 200) {
          this.firstList = res.data.data.categories
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
    },
    // 套餐
    selectmealType (val) {
      this.mealTypeList.forEach((ele, index) => {
        if (val === ele.typeCode) {
          this.seletIndex3 = index
        }
      })
      // if (val === '010401' || val === '010402') {
      let obj = { '010401': ['01-0101'], '010402': ['01-0101', '01-0103'], '010403': ['01-0101'] }
      goodsList({
        merchantId: this.$store.state.user.merchantId,
        goodsStatus: 1,
        goodsKindIdList: obj[val],
        offset: 0,
        skuName: '',
        limit: 9999
      }).then(res => {
        if (res.data.status === 200) {
          let goods = res.data.data.goods
          goods = res.data.data.goods
          // this.$nextTick(() => {
          if (val === '010401' || val === '010403') {
            this.formValidate2.selectedMeal = goods.map(ele => {
              return { ...ele, num: 1, isshow: false, checked: false }
            }).filter(ele => ele.skuName === '游戏币')
            // this.checkdList = this.formValidate2.selectedMeal
          }
          if (val === '010402') {
            this.formValidate2.selectedMeal = goods.map(ele => {
              return { ...ele, num: 1, isshow: false, checked: false }
            }).filter(ele => ele.skuName === '游戏币' || ele.skuName === '会员卡')
          }
          // })
          // this.formValidate2.selectedMeal.forEach(ele => {
          //   this.goodsComboList.push({
          //     subSkuId: ele.skuId,
          //     num: ele.num
          //   })
          // })
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
      // } else {
      this.typeIDThree = val
      this.goodsKindList[2] = { id: val, level: 3 }
      // }
    },
    // 添加游戏劵
    addmeal () {
      this.modalShow = true
    },
    // 提交步骤一
    submitOne () {
      this.$refs.formValidate1.validate((valid) => {
        if (valid) {
          if (this.current === 3) {
            this.current = 0
          } else {
            this.current += 1
          }
        }
      })
    },
    // 游戏劵取消
    selctshopCancel () {
      this.modalShow = false
    },
    // 游戏劵确认
    volumeSet (val) {
      this.checkdList = val
      // this.formValidate2.selectedMeal = this.formValidate2.selectedMeal.concat(this.checkdList)
      // let data = []
      if (this.formValidate2.selectedMeal.length === 2) {
        this.formValidate2.selectedMeal.splice(1, 1)
        this.checkdList.forEach(ele => {
          let arr = this.formValidate2.selectedMeal.map(item => item.skuName)
          if (arr.indexOf(ele.skuName) === -1) {
            this.formValidate2.selectedMeal.push(ele)
          }
        })
      } else {
        this.checkdList.forEach(ele => {
          let arr = this.formValidate2.selectedMeal.map(item => item.skuName)
          if (arr.indexOf(ele.skuName) === -1) {
            this.formValidate2.selectedMeal.push(ele)
          }
        })
      }
      this.modalShow = false
    },
    // 选择一级分类商品
    selectFirstClassify (first, idx) {
      this.active = idx
      this.active2 = 0
      this.formValidate1.involvedClassify = ['', '']
      this.formValidate1.involvedClassify[0] = first
      shopCategoryList({
        merchantId: this.$store.state.user.merchantId,
        parentCategoryId: first.categoryId,
        isShow: 1
      }).then(res => {
        if (res.data.status === 200) {
          this.secondList = res.data.data.categories || []
          this.formValidate1.involvedClassify[1] = this.secondList[this.active2]
          this.packageId = this.secondList[this.active2].packageId
          this.categoryId = this.secondList[this.active2].categoryId
          // if (this.packageId) {
          //   this.editPropertyList()
          // } else {
          //   this.formDynamic.list = []
          // }
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
    },
    seletcinput () {

    },
    // 营业项选择
    selecebusinessType (val) {
      this.businessTypeList.forEach((ele, index) => {
        if (val === ele.typeCode) {
          this.seletIndex4 = index
        }
      })
      this.typeIDTwo = val
      this.goodsKindList[1] = { id: val, level: 2 }
      kindList({
        merchantId: this.$store.state.user.merchantId,
        level: 3,
        parentId: val
      }).then(res => {
        if (res.data.status === 200) {
          // conosle.log('this.gatherPriceList', res.data.data)
          this.gatherPriceList = res.data.data
          // this.involvedTypeList = res.data.data
        } else {
          this.$Message.error(`${res.data.error}`)
        }
      })
    },
    selecebusinessType01 (val) {
      this.typeIDThree = val
      this.goodsKindList[2] = { id: val, level: 3 }
    },
    // 选择二级分类商品
    selectSecondClassify (second, idx) {
      this.active2 = idx
      this.formValidate1.involvedClassify[1] = second
      this.packageId = second.packageId
      this.categoryId = second.categoryId
      // }
    },
    // 步骤二中的上一步
    skipTwo () {
      this.current--
    },
    // 步骤二提交
    submitTwo () {
      this.$refs.formValidate2.validate((valid) => {
        if (valid) {
          if (this.current === 3) {
            this.current = 0
          } else {
            this.current += 1
          }
        }
      })
    },
    // 步骤三中的上一步
    skipThree () {
      this.current--
    },
    // 步骤三提交
    submitThree () {
      if (this.formValidate2.matchClassify === '0104') {
        this.goodsComboList = this.goodsComboList2
      }
      if (this.formValidate2.matchClassify === '0102') {
        this.goodsComboList = this.goodsComboList1
      }
      if (this.formValidate1.involvedType === '01' && this.formValidate2.matchClassify !== '0104') {
        this.goodsKindList.splice(2, 1)
      }
      if (this.formValidate1.involvedType === '03' && this.formValidate2.businessType !== '0301') {
        this.goodsKindList.splice(2, 1)
      }
      if ((this.$editor.txt.html() || '').length - 7 > 300) {
        this.$Message.error('商品详情文字不能大于300字')
        return false
      }
      this.$refs.formValidate3.validate(valid => {
        if (valid) {
          this.multUrlList = []
          this.uploadList.forEach(ele => {
            this.multUrlList.push({
              multUrl: ele.multUrl,
              multType: 0
            })
          })
          if (this.formDynamic.list.length > 0) {
            this.$refs.formDynamic.validate(valid => {
              if (valid) {
                // 修改时间2019.10.29---徐香君
                // this.goodsKindList = []
                let paramObj = {
                  merchantId: this.$store.state.user.merchantId,
                  shopId: this.formValidate2.involvedShop,
                  skuName: this.formValidate2.skuName,
                  spuName: this.formValidate2.skuName,
                  categoryId: this.categoryId,
                  barcode: this.formValidate2.barcode,
                  goodsUnit: this.formValidate2.goodsUnit,
                  keywords: this.formValidate2.keywords,
                  goodsDesc: this.formValidate2.goodsDesc,
                  goodsType: this.formValidate2.isShow,
                  creator: this.$store.state.user.userId,
                  creatorName: this.$store.state.user.userName,
                  subTitle: this.formValidate2.subTitle,
                  remark: this.formValidate2.remark,
                  orgName: this.$store.state.user.ororgName,
                  standardPrice: this.formValidate2.salesPrice,
                  goodsKindList: this.goodsKindList, // 商品业务类别,
                  multUrlList: this.multUrlList,
                  propertyList: this.formDynamic.list.map(item => {
                    if (item.inputType === 2) {
                      return {
                        inputType: item.inputType,
                        propNameId: item.propNameId,
                        propName: item.valueId,
                        propValueId: item.value
                      }
                    } else {
                      return {
                        inputType: item.inputType,
                        propNameId: item.propNameId,
                        propName: item.valueId,
                        propValueId: [item.value]
                      }
                    }
                  }),
                  goodsComboList: this.goodsComboList,
                  goodsHtml: this.$editor.txt.html(),
                  priceId: this.formValidate2.price, // 游戏券价格id
                  timesId: this.formValidate2.games, // 游戏券局数id
                  saleType: this.formValidate2.saleType, // 游戏券销售形式
                  status: 1 // 游戏券：0-待审核，1-审核通过，2-审核未通过，3-已上架，4-已下架，5-已删除
                }
                // over
                creatGoodsList(paramObj).then(res => {
                  if (res.data.status === 200) {
                    this.$Message.success('新增成功')
                    if (this.current === 3) {
                      this.current = 0
                    } else {
                      this.current += 1
                    }
                  } else {
                    this.$Message.error(`${res.data.error}`)
                  }
                })
              }
            })
          } else {
            // this.goodsKindList = []
            let paramObj = {
              merchantId: this.$store.state.user.merchantId,
              shopId: this.formValidate2.involvedShop,
              skuName: this.formValidate2.skuName,
              spuName: this.formValidate2.skuName,
              categoryId: this.categoryId,
              barcode: this.formValidate2.barcode,
              goodsUnit: this.formValidate2.goodsUnit,
              keywords: this.formValidate2.keywords,
              goodsDesc: this.formValidate2.goodsDesc,
              goodsType: this.formValidate2.isShow,
              creator: this.$store.state.user.userId,
              creatorName: this.$store.state.user.userName,
              subTitle: this.formValidate2.subTitle,
              remark: this.formValidate2.remark,
              orgName: this.$store.state.user.ororgName,
              goodsKindList: this.goodsKindList, // 商品业务类别,
              multUrlList: this.multUrlList,
              standardPrice: this.formValidate2.salesPrice,
              goodsComboList: this.goodsComboList,
              goodsHtml: this.$editor.txt.html(),
              priceId: this.formValidate2.price, // 游戏券价格id
              timesId: this.formValidate2.games, // 游戏券局数id
              saleType: this.formValidate2.saleType, // 游戏券销售形式
              status: 1 // 游戏券：0-待审核，1-审核通过，2-审核未通过，3-已上架，4-已下架，5-已删除
            }
            creatGoodsList(paramObj).then(res => {
              if (res.data.status === 200) {
                this.$Message.success('新增成功')
                if (this.current === 3) {
                  this.current = 0
                } else {
                  this.current += 1
                }
              } else {
                this.$Message.error(`${res.data.error}`)
              }
            })
          }
        }
      })
    },
    handleBeforeUpload () {
      const check = this.uploadList.length < 5
      if (!check) {
        this.$Notice.warning({
          title: '最多只能上传5张图片'
        })
      }
      return check
    },
    handleSuccess (response, file, fileList) {
      if (file.response.full_img_url) {
        let imgUrl = {
          name: file.name,
          multUrl: file.response.full_img_url
        }
        this.uploadList.push(imgUrl)
        if (this.uploadList.length > 5) {
          this.uploadList.splice(5, this.uploadList.length - 5)
        }
      }
    },
    handleFormatError () {
      this.$Notice.warning({
        title: '格式支持上传jpg、png'
      })
    },
    handleMaxSize () {
      this.$Notice.warning({
        title: '图片限制最大5m'
      })
    },
    // 返回商品列表
    skipList () {
      clearInterval(this.timer)
      this.handleReset()
    },
    // 关闭标签
    handleReset () {
      this.$store.commit('closeTag', this.$route)
      // this.$store.commit('setTagNavList', this.$store.state.app.tagNavList.filter(item => !routeEqual(this.$route, item)))
      if (this.$store.state.app.tagNavList[this.$store.state.app.tagNavList.length - 1].name !== 'commodity_list') {
        this.$nextTick(() => {
          localStorage.setItem('creatidt', 1)
          this.$router.push({
            name: 'commodity_list'
          })
        })
      }
    }
  },
  created () {
    this.getkindList()
    this.getshopCategoryList()
    // this.formValidate1.involvedClassify = [this.firstList[0], this.secondList[0]]
  },
  mounted () {
    this.createEditor(this.$refs.addEditor)
    if (this.$store.state.user.orgType) {
      this.formValidate2.involvedShop = this.$store.state.user.orgId
    }
  }
}
</script>

<style lang="less">
#commodity_create {
  .third-level {
    .ivu-form-item-error-tip {
      left: 203px;
    }
  }
  .ivu-select ivu-select-multiple ivu-select-default {
    margin: auto;
  }
  .three-form {
    .ivu-form-item-label {
      border: 1px solid #dcdee2;
    }
  }
  .rich-editor {
    width: 700px;
    text-align: left;
    .w-e-toolbar {
      flex-wrap: wrap;
    }
  }
  .prev {
    width: 31% !important;
  }
  .complate {
    width: 7% !important;
  }
  .content-style {
    margin: 0 auto !important;
  }
  .title {
    display: flex;
    margin-bottom: 30px;
    p {
      width: 8px;
      height: 20px;
      background: #2d8cf0;
      margin-right: 10px;
    }
  }
  .classify-content {
    display: flex;
    align-items: center;
    .section-content {
      width: 230px;
      height: 263px;
      border: 1px solid #e8eaec;
      border-radius: 3px;
    }
    p {
      background: #f9fafc;
      border-bottom: 1px solid #e8eaec;
      padding: 0 8px;
    }
    ul {
      margin-top: 5px;
      li {
        list-style: none;
        padding: 0 15px;
        display: flex;
        align-items: center;
        justify-content: space-between;
      }
    }
    .selected {
      background: #f8f8f9;
      color: #2d8cf0;
    }
  }
}
</style>
